<template>
  <div class="tradeDetail">
    <van-nav-bar title="交易详情" left-arrow @click-left="onClickLeft" />
    <div class="bigBox">
      <div class="tradeBox">
        <div class="topbox">
          <p class="topTite">网银转入</p>
          <p class="topMoney">8.10</p>
        </div>
        <van-divider />
        <div class="mainbox">
          <van-cell class="box" size="large">
            <template #title>
              <p class="cellTitle">信用卡</p>
            </template>
            <template #default>
              <p class="cellInfo">腾讯白金卡(尾号1102)</p>
            </template>
          </van-cell>
          <van-cell class="box" size="large">
            <template #title>
              <p class="cellTitle">交易日期</p>
            </template>
            <template #default>
              <p class="cellInfo">2024-03-04 07:58:47</p>
            </template>
          </van-cell>
          <van-cell class="box" size="large">
            <template #title>
              <p class="cellTitle">记账日期</p>
            </template>
            <template #default>
              <p class="cellInfo">2024-03-04</p>
            </template>
          </van-cell>
          <van-cell class="box" size="large">
            <template #title>
              <p class="cellTitle">币种</p>
            </template>
            <template #default>
              <p class="cellInfo">人民币</p>
            </template>
          </van-cell>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {};
  },
  methods: {
    onClickLeft() {
      window.history.go(-1);
    }
  }
};
</script>

<style lang="less" scoped>
/deep/ .van-icon {
  color: #676565;
}
/deep/.van-nav-bar__title {
  color: #676565;
}
.bigBox {
  padding: 0 0.16rem;
}
.tradeDetail {
  background-color: #5756560d;
}
.tradeBox {
  background-color: #fff;
}
.cellTitle {
  color: #9d9292;
}
.cellInfo {
  color: black;
}
.topbox {
  height: 0.8rem;
  background-color: #fff;
  text-align: center;
  margin-top: 0.1rem;
  padding-top: 0.2rem;
  border-radius: 0.05rem;
  p {
    margin: 0;
  }
  .topTite {
    font-size: 0.16rem;
    color: #9d9292;
  }
  .topMoney {
    margin-top: 0.1rem;
    font-size: 0.36rem;
    font-weight: 700;
  }
}
.mainbox {
  p {
    margin: 0;
  }
}
/deep/.van-cell::after {
  border-bottom: 0px;
}
</style>